<div class="container">
  <div class="mb-3 row">
    <div class="col-sm">
      <a [routerLink]="['/']"><gf-logo /></a>
    </div>
    <div class="col-sm">
      <div class="h6 mt-2" i18n>Personal Finance</div>
      <ul class="list-unstyled">
        @if (hasPermissionToAccessFearAndGreedIndex) {
          <li>
            <a i18n [routerLink]="routerLinkMarkets">Markets</a>
          </li>
        }
        <li><a i18n [routerLink]="routerLinkResources">Resources</a></li>
      </ul>
    </div>
    <div class="col-sm">
      <div class="h6 mt-2">Ghostfolio</div>
      <ul class="list-unstyled">
        <li><a i18n [routerLink]="routerLinkAbout">About</a></li>
        @if (hasPermissionForSubscription) {
          <li>
            <a i18n [routerLink]="routerLinkBlog">Blog</a>
          </li>
        }
        <li>
          <a i18n [routerLink]="routerLinkAboutChangelog">Changelog</a>
        </li>
        <li><a i18n [routerLink]="routerLinkFeatures">Features</a></li>
        @if (hasPermissionForSubscription) {
          <li>
            <a i18n [routerLink]="routerLinkFaq"
              >Frequently Asked Questions (FAQ)</a
            >
          </li>
        }
        @if (!hasPermissionForSubscription) {
          <li>
            <a i18n [routerLink]="routerLinkAboutLicense">License</a>
          </li>
        }
        @if (hasPermissionForStatistics) {
          <li>
            <a [routerLink]="routerLinkOpenStartup">Open Startup</a>
          </li>
        }
        @if (hasPermissionForSubscription) {
          <li>
            <a i18n [routerLink]="routerLinkPricing">Pricing</a>
          </li>
        }
        @if (hasPermissionForSubscription) {
          <li>
            <a i18n [routerLink]="routerLinkAboutPrivacyPolicy"
              >Privacy Policy</a
            >
          </li>
        }
        @if (hasPermissionForSubscription) {
          <li>
            <a i18n [routerLink]="routerLinkAboutTermsOfService"
              >Terms of Service</a
            >
          </li>
        }
        @if (hasPermissionForSubscription) {
          <li>
            <a
              class="align-items-baseline d-flex"
              href="https://status.ghostfol.io"
              target="_blank"
              title="Ghostfolio Status"
              >Status<ion-icon class="ml-1" name="open-outline"
            /></a>
          </li>
        }
      </ul>
    </div>
    <div class="col-sm">
      <div class="h6 mt-2" i18n>Community</div>
      <ul class="list-unstyled">
        <li>
          <a
            class="align-items-baseline d-flex"
            href="https://github.com/ghostfolio/ghostfolio"
            target="_blank"
            title="Find Ghostfolio on GitHub"
            >GitHub<ion-icon class="ml-1" name="open-outline"
          /></a>
        </li>
        <li>
          <a
            class="align-items-baseline d-flex"
            href="https://linkedin.com/company/ghostfolio"
            target="_blank"
            title="Follow Ghostfolio on LinkedIn"
            >LinkedIn<ion-icon class="ml-1" name="open-outline"
          /></a>
        </li>
        <li>
          <a
            class="align-items-baseline d-flex"
            href="https://join.slack.com/t/ghostfolio/shared_invite/zt-vsaan64h-F_I0fEo5M0P88lP9ibCxFg"
            target="_blank"
            title="Join the Ghostfolio Slack community"
            >Slack<ion-icon class="ml-1" name="open-outline"
          /></a>
        </li>
        <li>
          <a
            class="align-items-baseline d-flex"
            href="https://x.com/ghostfolio_"
            target="_blank"
            title="Follow Ghostfolio on X (formerly Twitter)"
            >X (formerly Twitter)<ion-icon class="ml-1" name="open-outline"
          /></a>
        </li>
        <li>&nbsp;</li>
        <!--
          <li>
            <a href="../ca" title="Ghostfolio en català">Català</a>
          </li>
        -->
        <li>
          <a href="../zh" title="Ghostfolio in Chinese">Chinese</a>
        </li>
        <li>
          <a href="../de" title="Ghostfolio in Deutsch">Deutsch</a>
        </li>
        <li>
          <a href="../en" title="Ghostfolio in English">English</a>
        </li>
        <li>
          <a href="../es" title="Ghostfolio in Español">Español</a>
        </li>
        <li>
          <a href="../fr" title="Ghostfolio en Français">Français</a>
        </li>
        <li>
          <a href="../it" title="Ghostfolio in Italiano">Italiano</a>
        </li>
        <li>
          <a href="../nl" title="Ghostfolio in Nederlands">Nederlands</a>
        </li>
        <li>
          <a href="../pl" title="Ghostfolio in Polski">Polski</a>
        </li>
        <li>
          <a href="../pt" title="Ghostfolio in Português">Português</a>
        </li>
        <li>
          <a href="../tr" title="Ghostfolio in Türkçe">Türkçe</a>
        </li>
        <!--
          <li>
            <a href="../uk" title="Ghostfolio in Українська">Українська</a>
          </li>
        -->
      </ul>
    </div>
  </div>
  <div class="mb-2 row text-center">
    <div class="col">
      © 2021 - {{ currentYear }}
      <a href="https://ghostfol.io">Ghostfolio</a>
    </div>
  </div>
  <div class="row text-center text-muted">
    <div class="col">
      <small class="d-block" i18n
        >The risk of loss in trading can be substantial. It is not advisable to
        invest money you may need in the short term.</small
      >
    </div>
  </div>
</div>
<div class="container d-none d-md-block mt-5">
  <div class="row justify-content-center">
    <div class="font-weight-bold line-height-1 logotype">Ghostfolio</div>
  </div>
</div>
